<template>
  <page-header-wrapper>
    <a-card :bordered="false">
      <div class="table-page-search-wrapper">
        <a-form layout="inline" :label-col="labelCol" :wrapper-col="wrapperCol" labelAlign="left" :form="form">
          <a-row :gutter="48">

            <template v-if="!advanced">
              <a-col :md="8" :sm="24">
                <a-form-item label="模糊搜索">
                  <a-input  placeholder="" v-model="search" />
                </a-form-item>
              </a-col>
            </template>

            <template v-if="advanced">
              <a-col :md="8" :sm="24">
                <a-form-item label="补丁编号:">
                  <a-input placeholder="请输入" v-decorator="['patchNo']"/>
                </a-form-item>
              </a-col>
              <a-col :md="8" :sm="24">
                <a-form-item label="补丁描述:">
                  <a-input placeholder="" v-decorator="['abs']"/>
                </a-form-item>
              </a-col>
              <a-col :md="8" :sm="24">
                <a-form-item label="危险等级:">
                  <a-select  placeholder="请选择" v-decorator="['dangerLv']">
                    <a-select-option value="">全部</a-select-option>
                    <a-select-option v-for="item in DangerLevel" :value="item.value">{{item.label}}</a-select-option>
                  </a-select>
                </a-form-item>
              </a-col>
              <a-col :md="8" :sm="24">
                <a-form-item label="操作系统:">
                  <a-select  placeholder="请选择" v-decorator="['adaptationOs']">
                    <a-select-option value="">全部</a-select-option>
                    <a-select-option v-for="item in Ostype" :value="item.value">{{item.label}}</a-select-option>
                  </a-select>
                </a-form-item>
              </a-col>
              <a-col :md="8" :sm="24">
                <a-form-item label="补丁类型:">
                  <a-select  placeholder="请选择" v-decorator="['patchTypes']">
                    <a-select-option value="">全部</a-select-option>
                    <a-select-option v-for="item in PatchType" :value="item.value">{{item.label}}</a-select-option>
                  </a-select>
                </a-form-item>
              </a-col>


              <a-col :md="8" :sm="24">
                <a-form-item label="发布时间:">
                  <a-date-picker  v-decorator="['publishingTime']" style="width: 100%;"/>
                </a-form-item>
              </a-col>
            </template>
            <a-col :md="(!advanced && 8) || 24" :sm="24">
                    <span
                      class="table-page-search-submitButtons"
                      :style="(advanced && { float: 'right', overflow: 'hidden' }) || {}"
                    >
                      <a-button type="primary" @click="getliblist()">查询</a-button>
                      <a-button style="margin-left: 8px" @click="resetform()">重置</a-button>

                      <a @click="toggleAdvanced" style="margin-left: 8px">
                        {{ advanced ? '收起' : '展开' }}
                        <a-icon :type="advanced ? 'up' : 'down'" />
                      </a>
                    </span>
            </a-col>
          </a-row>
        </a-form>
      </div>

      <a-row>

      </a-row>
    </a-card>
  </page-header-wrapper>
</template>

<script>
  export default {
    name: 'loophole',
    data(){
      return{
        labelCol: {
          xs: { span: 24 },
          sm: { span: 6 },
        },
        wrapperCol: {
          xs: { span: 24 },
          sm: { span: 12 },
        },
        advanced:false,
      }
    },
    methods:{
      toggleAdvanced() {
        this.advanced = !this.advanced
      },
    }
  }
</script>

<style scoped>

</style>